<template>
	<div :class="classes">
		<div :class="barConClasses">
			<i :class="`${prefix}-bar`" v-once v-for="i in 8" :key="`trigger-${i}`"></i>
		</div>
	</div>
</template>

<script>
export default {
	name: 'Trigger',
	props: {
		mode: String
	},
	data() {
		return {
			prefix: 'ivu-split-trigger',
			initOffset: 0
		};
	},
	computed: {
		isVertical() {
			return this.mode === 'vertical';
		},
		classes() {
			return [this.prefix, this.isVertical ? `${this.prefix}-vertical` : `${this.prefix}-horizontal`];
		},
		barConClasses() {
			return [`${this.prefix}-bar-con`, this.isVertical ? 'vertical' : 'horizontal'];
		}
	}
};
</script>

<style lang="less">
@import './index.less';
</style>
